﻿<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Ease Link</title>
<!-- inspired by http://www.maratz.com/blog/archives/2006/06/11/fancy-checkboxes-and-radio-buttons/ -->
<script type="text/javascript" src="PrefBranch.js"></script>
<script type="text/javascript" src="settings.js"></script>
<style type="text/css">
body {
  font-family: sans-serif;
  font-size: 14px;
  background: #080808;
  color: #fff;
  -webkit-user-select: none;
}

body > header {
  width: 48px;
  height: 48px;
  margin: 40px auto;
  background: url(48.png) no-repeat left center;
  margin-bottom: 20px;
}

ul {
  border-radius: 10px;
  background: -webkit-gradient(linear, 0% 0%, 0% 50%, from(#999), color-stop(1, #666));
  width: 300px;
  margin: 0 auto;
  padding: 15px 20px;
  -webkit-box-shadow: 0 5px 20px rgba(0,0,0,0.3),
                      0 20px 200px rgba(255,255,255,0.2);
}

li {
  list-style: none;
  margin: 0;
}

li:not(:first-child) {
  border-top: 2px #999 groove;
  padding-top: 10px;
  margin-top: 10px;
}

label {
  display: block;
  padding: 6px 0;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

input[type="checkbox"] {
  display: none;
}

input[type="checkbox"]+span {
  display: block;
  background: no-repeat 0 50%;
  background-image: url();
  line-height: 19px;
  -webkit-transition: background-image 0.2s linear;
  padding: 2px 0 4px 30px;
}

input[type="checkbox"]:checked+span {
  background-image: url();
}

</style>
</head>
<body>
<header></header>
<form id="options">
<ul>
<li>
  <label><input type="checkbox" name="plain" title="options_plain_label" /><span></span></label>
</li>
<li>
  <label><input type="checkbox" name="thunder" title="options_linktype_label,options_thunder_label" /><span></span></label>
  <label><input type="checkbox" name="qqxuanfeng" title="options_linktype_label,options_qqxuanfeng_label" /><span></span></label>
</li>
<li>
  <label><input type="checkbox" name="nocontext" title="options_nocontext" /><span></span></label>
</li>
</form>
</body>
</html>
